<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>信用线索企业详情信息管理</title>
	<script src="../../js/header.js"></script>
</head>

<body>
<div v-cloak id="app">
	<div style="margin-top: 10px;">
		<div style="margin-top: 10px;border-bottom:1px solid rgba(200,200,200,0.43);">
			<el-form :model="selectForm" :rules="rules" ref="selectForm" label-width="150px">
				<el-row>
					<el-col :span="8">
						<el-form-item label="信用线索原因:" prop="" label-width="160px">
							<el-select v-model="selectForm.creditClueReasons">
								<el-option label="信用分类E" value="信用分类E"></el-option>
								<el-option label="信用分类D" value="信用分类D"></el-option>
								<el-option label="信用分类一次性下降≥2档" value="信用分类一次性下降≥2档"></el-option>
								<el-option label="击中特定负面" value="击中特定负面"></el-option>
							</el-select>
						</el-form-item>
					</el-col>
					<el-col span="8">
						<el-form-item label="企业名称:">
							<el-input v-model="selectForm.enterpriseName" placeholder="" ></el-input>
						</el-form-item>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="8">
						<el-form-item label="企业证件号码:" prop="" label-width="160px">
							<el-input v-model="selectForm.enterpriseIdNumber" placeholder="" ></el-input>
						</el-form-item>
					</el-col>
					<el-col :span="8">
						<el-form-item label="信用评估状态:" prop="">
							<el-select v-model="selectForm.status">
								<el-option label="已接收" value="0"></el-option>
								<el-option label="已调整" value="1"></el-option>
								<el-option label="已反馈" value="2"></el-option>
							</el-select>
						</el-form-item>
					</el-col>

					<div style="float: right;">
						<!--<el-button type="primary" size="small" style="width: 60px;height: 30px;" @click="apply()">申请</el-button>-->
						<el-button type="primary" size="small" style="width: 60px;height: 30px;" @click="searchForm()">查询</el-button>
						<el-button type="warning" size="small" style="width: 60px;height: 30px;" @click="resetForm()">重置</el-button>
						<!--<el-button type="primary" size="small" style="width: 60px;height: 30px;" @click="appovalEx()">导出</el-button>-->
						<!--<el-button type="primary" size="small" style="width: 60px;height: 30px;" @click="exportLoadown()">导出</el-button>-->

					</div>
				</el-row>
			</el-form>
		</div>

		<el-table :data="tableData" border style="width: 100%;margin-top: 35px;" ref="multipleTable"
      	@selection-change="handleSelectionChange" :header-cell-style="{background:'#eef1f6',color:'#606266'}">
			<el-table-column type="selection" ></el-table-column>
			<el-table-column
					type="index"
					label="序号"
					width="80"
					align="center">
			</el-table-column>
			<el-table-column
					prop="enterpriseName"
					label="企业名称"
					width="300"
					align="center" >
			</el-table-column>
			<el-table-column
					prop="enterpriseIdType"
					label="企业证件类型"
					width="200"
					align="center">
			</el-table-column>
			<el-table-column
					prop="enterpriseIdNumber"
					label="企业证件号码"
					width="240"
					align="center">
			</el-table-column>
			<el-table-column
					prop="creditClueReasons"
					label="信用线索原因"
					width="150"
					align="center">
			</el-table-column>
			<el-table-column
					prop="evaluationDate"
					label="评估日期"
					width="150"
					align="center">
			</el-table-column>
			<el-table-column
					prop="status"
					label="信用线索评估状态"
					width="150"
					align="center">
				<template scope="scope">
					<span v-if="scope.row.status==0" style="color:#F19437;">已接收</span>
					<span v-if="scope.row.status==1" style="color:#20A0FF;">已调整</span>
					<span v-if="scope.row.status==2" style="color:#67C23A;">已反馈</span>
				</template>
			</el-table-column>
			<el-table-column
					label="操作"
					width=""
					align="center">
				<template slot-scope="scope">
					<el-button size="mini" @click="view(scope.$index,scope.row)">查看</el-button>
				</template>
			</el-table-column>
		</el-table>
		<div style="overflow: hidden;">
			<div class="pagination">
				<el-pagination
						@size-change="handleSizeChange"
						@current-change="handleCurrentChange"
						:current-page="currentPage"
						:page-sizes="[10, 20, 30, 40]"
						:page-size="pagesize"
						background
						layout="total, sizes,prev, pager, next"
						:total="tableTotal"
						prev-text="上一页"
						next-text="下一页">
				</el-pagination>
				<el-button type="primary" size="mini" @click="appovalEx()" style="float: right;">批量导出</el-button>
			</div>			
		</div>

		<!-- 信用线索企业详情信息表 -->
		<el-dialog title="" :visible.sync="dialogForm" center fullscreen>
			<div style="margin-top: 10px;">
				<el-form :model="cluemessage" :rules="rules" ref="cluemessage" label-width="140px" class="form_date_width">
					<!--信用线索企业详情信息表-->
					<el-row>
						<el-col :span="4" class="tab-title">
							企业信用线索详细信息
						</el-col>
					</el-row>
					<el-row>
						<el-col :span="12">
							<el-form-item label="企业名称:" prop="enterpriseName" label-width="150px">
								<el-input v-model="cluemessage.enterpriseName" placeholder="" :disabled="formDisabled"></el-input>
							</el-form-item>
						</el-col>
						<el-col :span="12">
							<el-form-item label="企业证件类型:" prop="enterpriseIdType" label-width="150px">
								<el-input v-model="cluemessage.enterpriseIdType" :disabled="formDisabled"></el-input>
							</el-form-item>
						</el-col>
					</el-row>
					<el-row>
                        <el-col :span="12">
                            <el-form-item label="企业证件号码:" prop="enterpriseIdNumber" label-width="150px">
                                <el-input v-model="cluemessage.enterpriseIdNumber" :disabled="formDisabled"></el-input>
                            </el-form-item>
                        </el-col>
						<el-col span="12">
							<el-form-item label="信用线索原因:" prop="creditClueReasons" label-width="150px">
								<!--<el-input v-model="cluemessage.creditClueReasons" placeholder="" :disabled="formDisabled"></el-input>-->
								<el-select v-model="cluemessage.creditClueReasons" :disabled="formDisabled">
									<el-option label="信用分类E" value="信用分类E"></el-option>
									<el-option label="信用分类D" value="信用分类D"></el-option>
									<el-option label="信用分类一次性下降≥2档" value="信用分类一次性下降≥2档"></el-option>
									<el-option label="击中特定负面" value="击中特定负面"></el-option>
								</el-select>
							</el-form-item>
						</el-col>
					</el-row>
                    <el-row>
                        <el-col span="24">
                           <el-form-item label="涉及负面详情:" prop="negativeDetails" label-width="150px">
							   <el-input type="textarea" :autosize="{ minRows: 8, maxRows: 8}" v-model="cluemessage.negativeDetails" :disabled="formDisabled"></el-input>
						   </el-form-item>
                        </el-col>
                    </el-row>
					<el-row>
						<el-col :span="8">
							<el-form-item label="省级:" prop="provincial" label-width="150px">
								<el-input v-model="cluemessage.provincial" placeholder="" :disabled="formDisabled"></el-input>
							</el-form-item>
						</el-col>
						<el-col :span="8">
							<el-form-item label="市级:" prop="municipalLevel" label-width="150px">
								<el-input v-model="cluemessage.municipalLevel" :disabled="formDisabled"></el-input>
							</el-form-item>
						</el-col>
						<el-col :span="8">
							<el-form-item label="县级:" prop="countyLevel" label-width="150px">
								<el-input v-model="cluemessage.countyLevel" :disabled="formDisabled"></el-input>
							</el-form-item>
						</el-col>
					</el-row>
					<el-row>
                        <el-col :span="12">
                            <el-form-item label="国标一级行业名称:" prop="nationalStandard1Name" label-width="150px">
                                <el-input v-model="cluemessage.nationalStandard1Name" :disabled="formDisabled"></el-input>
                            </el-form-item>
                        </el-col>
						<el-col :span="12">
							<el-form-item label="国标二级行业名称:" prop="nationalStandard2Name" label-width="150px">
								<el-input v-model="cluemessage.nationalStandard2Name" :disabled="formDisabled"></el-input>
							</el-form-item>
						</el-col>
					</el-row>
					<el-row>
                        <el-col :span="12">
                            <el-form-item label="国标三级行业名称:" prop="nationalStandard3Name" label-width="150px">
                                <el-input v-model="cluemessage.nationalStandard3Name" placeholder="" :disabled="formDisabled"></el-input>
                            </el-form-item>
                        </el-col>
						<el-col :span="12">
							<el-form-item label="国标四级行业名称:" prop="nationalStandard4Name" label-width="150px">
								<el-input v-model="cluemessage.nationalStandard4Name" :disabled="formDisabled"></el-input>
							</el-form-item>
						</el-col>
                    </el-row>
                    <el-row>
						<el-col :span="12">
							<el-form-item label="评估日期:" prop="evaluationDate" label-width="150px">
								<el-date-picker
									type="date"
									value-format="yyyy-MM-dd"
									v-model="cluemessage.evaluationDate"
									:disabled="formDisabled">
								</el-date-picker>
							</el-form-item>
						</el-col>
						<el-col :span="12">
							<el-form-item label="信用评估状态:" prop="status" label-width="150px">
                                <el-select v-model="cluemessage.status" :disabled="formDisabled" style="width: 100%;">
									<el-option label="请选择" value=""></el-option>
									<el-option label="已接收" value="0"></el-option>
									<el-option label="已调整" value="1"></el-option>
									<el-option label="已反馈" value="2"></el-option>
                                </el-select>
                            </el-form-item>
						</el-col>
					</el-row>
					<el-row>
						<el-col :span="22">
							<div style="float:right;">
								<!--<el-button v-show="showOnSubmit" type="primary" size="small" style="width: 60px;height: 30px;" @click="onSubmit()">提交</el-button>
								<el-button v-show="showOnReplace" type="primary" size="small" style="width: 60px;height: 30px;" @click="onReplace()">修改</el-button>-->
								<el-button type="info" size="small" style="width: 60px;height: 30px;" @click="dialogForm = false;clearForm()">取消</el-button>
							</div>
						</el-col>
					</el-row>
				</el-form>
			</div>
		</el-dialog>
	</div>
</div>
<script>
    var vm = new Vue({
        el: '#app',
        data() {
            return {
                provinceData: [],
				cityData:[],
				areaData: [],


                currentPage: 1, //默认显示页面为1
                pagesize: 10, // 每页的数据条数
                tableTotal:'',
				multipleTable: [],     //存放选中值的数组
				cluemessage: {
                    id : '',
                    enterpriseName : '',
                    enterpriseIdNumber : '',
                    enterpriseIdType : '',
                    creditClueReasons : '',
                    negativeDetails : '',
                    provincial : '',
                    municipalLevel : '',
                    countyLevel : '',
                    nationalStandard1Name : '',
                    nationalStandard2Name : '',
                    nationalStandard3Name : '',
                    nationalStandard4Name : '',
                    evaluationDate : '',
                    status : '',

                },
                formDisabled: false,
                rules: {
                    enterpriseName : {
                        required : true,
						message : '企业名称必填',
						trigger : 'blur'
					},
                    enterpriseIdType : {
                        required : true,
						message : '企业证件类型必填',
						trigger : 'blur'
					},
                    enterpriseIdNumber : {
                      	required : true,
						message : '企业证件号码必填',
						trigger : 'blur'
					},
                    creditClueReasons : {
                        required : true,
						message : '信用线索原因必填',
						trigger : 'blur'
					},
                    negativeDetails : {
                        required : true,
						message : '涉及负面详情必填',
						trigger : 'blur'
					},
					status: {
                        required : true,
						message : '信用评估状态必填',
						trigger : 'blur'
					}
                },
                dialogForm: false,
                selectForm: {
                    enterpriseName: '',
                    enterpriseIdNumber: '',
                    creditClueReasons: '',
                    status: ''
                },

                currentRow: null,
                tableData: [],
                showOnSubmit: true,
                showOnReplace: false
            }
        },
        created() {
            /* 地区加载数据 */
            axios.get('../../json/ChinaCity.json').then(res => {
                this.provinceData = res.data;
			}).catch(e => {
					this.$message.error("网络连接超时");
			});


        },
        mounted(){
            this.getData();
        },
        methods: {
            getData() {
            	console.log(this.selectForm.status)
            	var pagesize = this.pagesize;
                var pageno = this.currentPage;
                axios({
                    method: 'get',
                    url: '/dzjzfjg/clue/listClue',
                    params: {
                        pageSize: pagesize,
                        pageNo: pageno,
                        enterpriseName: this.selectForm.enterpriseName,
                        creditClueReasons: this.selectForm.creditClueReasons,
                        enterpriseIdNumber: this.selectForm.enterpriseIdNumber,
                        status: this.selectForm.status
                    }
                })
				.then(response => {
					console.log(response)
					let data = response.data;
					if (data.code == 200) {
						let dataInformation = data.data.results;
						this.tableTotal = data.data.total;// 数据长度

						this.tableData = dataInformation;
					} else {
						this.$message.error(data.msg);
					}
				})
				.catch(function (error) {
					console.log(error);
				});
            },
            // 表单提交
            onSubmit() {
                this.$refs.cluemessage.validate((valid) => {
                    if (valid) {
                        axios({
                            method: 'post',
                            url: '/dzjzfjg/clue/add',
                            data: this.cluemessage
                        })
                            .then((response) => {
                                let data = response.data;
                                if (data.code == 200) {
                                    this.dialogForm = false;
                                    this.$message({
                                        type: 'success',
                                        message: '添加成功!'
                                    });
                                    this.getData();
                                } else {
                                    this.$message.error(data.msg);
                                }
                            });
                    }
                })

            },
            // 表单修改
            onReplace(){
                this.$refs.cluemessage.validate((valid) => {
                    if (valid) {
                        axios({
                            method: 'post',
                            url: '/dzjzfjg/clue/update',
                            data: this.cluemessage
                        })
						.then((response) => {
							let data = response.data;
							if (data.code == 200) {
								this.dialogForm = false;
								this.$message({
									type: 'success',
									message: '修改成功!'
								});
								this.getData();
							} else {
								this.$message.error(data.msg);
							}
						});
                    }
                })

            },
            clearForm(){
                this.$refs.cluemessage.clearValidate();
				this.$refs.cluemessage.resetFields();
				this.cluemessage.id="";
            },
            handleChange(value) {
                console.log(value);
            },
            handleSelectionChange(val) {
            	console.log(val);
    			this.multipleTable = val;   //  this.multipleTable 选中的值
		      	
		    },
		    batchExport(){
		    	var ids='';
		    	for(let i=0;i<this.multipleTable.length;i++){
	    	    	ids += this.multipleTable[i].id;
		    	    if(i < this.multipleTable.length-1){
		    	    	ids += ',';
		    	    }
		    	}
		    	console.log(ids);
		    	window.location.href="/dzjzfjg/clue/export?ids="+ids;
//		    	axios({
//                  method: 'post',
//                  url: '/dzjzfjg/detail/export',
//                  data: this.multipleTable
//              })
//              .then((response) => {
//                  if (response.data.code == 200) {
//                      this.$message({
//                          type: 'success',
//                          message: '导出成功!'
//                      });
//                      this.getData();
//                  } else {
//                      this.$message.error(data.msg);
//                  }
//              });
		    },
            apply(){
                this.dialogForm = true;
                this.showOnSubmit = true;
                this.showOnReplace = false;

                this.clearForm();

                this.formDisabled = false;
            },
            /* 单选搜索表单 */
            selectCurrentChange(val){
                this.currentRow = val;
            },
            /* 列表页搜索 */
            searchForm() {
            	this.currentPage = 1;
            	var pagesize = this.pagesize;
                axios({
                    method: 'get',
                    url: '/dzjzfjg/clue/listClue',
                    params: {
                        pageSize: pagesize,
                        pageNo: this.currentPage,
                        enterpriseName: this.selectForm.enterpriseName,
                        creditClueReasons: this.selectForm.creditClueReasons,
                        enterpriseIdNumber: this.selectForm.enterpriseIdNumber,
                        status: this.selectForm.status
                    }
                })
                .then(response => {
                    let data = response.data;
                    console.log(data);
                    if (data.code == 200) {
                        let dataInformation = data.data.results;
                        this.tableTotal = data.data.total;// 数据长度

                        this.tableData = dataInformation;
                    } else {
                        this.$message.error(data.msg);
                    }
                })
                .catch(function (error) {
                    console.log(error);
                });
            },
            /* 列表页重置 */
            resetForm(formName) {
                this.selectForm.enterpriseName = '';
				this.selectForm.creditClueReasons = '';
                this.selectForm.enterpriseIdNumber = '';
                this.selectForm.status = '';
                this.searchForm();
            },
            //每页下拉显示数据
            handleSizeChange(size) {
                this.pagesize = size;
                this.getData();
            },
            //点击第几页
            handleCurrentChange(currentPage) {
                this.currentPage = currentPage;
                this.getData();
            },
            // 设置允许填写和不允许填写
            checkDisabled(n){
                if(n){
                    this.formDisabled = true;
                }else{
                    this.formDisabled = false;
                }
            },
            /* 选择省份 */
            chooseProvince(value) {
                this.editcityValue = '';
                this.editareaValue = '';
                this.cityData = [];
                this.areaData = [];
                this.provinceData.map(e => {//遍历数据
                    if (value == e.name) {
                    this.cityData = e.cityList;
                    return;
                }
            });
                console.log(value);
                this.editprovinceValue = value;
            },
            /* 选择城市 */
            chooseCity(value) {
                this.editareaValue = '';
                this.cityData.map(e => {//遍历数据
                    if (value == e.name) {
                    this.areaData = e.areaList;
                    return;
                }
            });
                console.log(value);
                this.editcityValue = value;
            },
            /* 选择区域 */
            chooseArea(value) {
                console.log(value);
                this.newareaValue = value;
                this.jgxwother.addressRegistered = this.provinceValue + "-" + this.cityValue + "-" + this.areaValue;

            },
            //导出
            appovalEx(){
            	this.$confirm('确定要导出吗?', '提示', {
                    cancelButtonText: '取消',
                    confirmButtonText: '确定',
                    type: 'warning'
                }).then(() => {
	                window.location.href="/dzjzfjg/clue/exportClue?enterpriseName="+this.selectForm.enterpriseName+"&enterpriseIdNumber="
	                    +this.selectForm.enterpriseIdNumber+"&creditClueReasons="
	                    +this.selectForm.creditClueReasons+"&status="
	                    +this.selectForm.status;
	            }).catch(() => {
                    this.$message({
                        type: 'info',
                        message: '取消导出'
                    });
                });
            },
            /*//导出下载
            exportLoadown(){
                window.location.href="/dzjzfjg/clue/exportExcel?&pageNo=1";
            },*/
            // 查看
            view(index,row){
                this.dialogForm = true;
                this.showOnReplace = false;
                this.showOnSubmit = false;

                this.showInformation(index,row);
                this.checkDisabled(true);
            },
            // 修改
            edit(index,row){
                this.dialogForm = true;
                this.showOnReplace = true;
                this.showOnSubmit = false;

                this.showInformation(index,row);
                this.checkDisabled(false);
            },
            // 公共方法--查看
            showInformation(index,row){
                console.log(row);

                axios({
                    method: 'get',
                    url: '/dzjzfjg/clue/queryById',
                    params: {
                        id: row.id
                    }
                })
				.then(response => {
					let data = response.data;
					if (data.code == 200) {
						let rowdata = response.data.data;
						this.clearForm(); // 重置

						this.cluemessage = rowdata;
					} else {
						this.$message.error(data.msg);
					}
				})
				.catch(function (error) {
					console.log(error);
				});
            }
        }
    })
</script>
</body>
</html>